<template>
	<view class="module flex_ZC">
		<!-- #ifdef H5 -->
			<uNavbar title="提交信息"> </uNavbar>
		<!-- #endif -->
		<!-- #ifdef MP-WEIXIN -->
		<view class="custom_box">
			<image class="indexbg" :src="baseUrl +'/static/image/indexbg.png'" mode="aspectFill"></image>
			<view :style="{height: statusBarHeight + 'px', backgroundColor: backgroundColor }"></view>
			<view class="custom_nav " :style="{height: titleHeight + 'px', backgroundColor: backgroundColor}">
				<image class="goback" :src="baseUrl +'/static/icon/i_left.png'" mode="aspectFill" @click="leftClick"></image>
				<text class="f28 c3">提交信息</text>
			</view>
		</view>
		<view :style="{height: statusBarHeight + titleHeight + 'px'}" style="width: 100%;"></view>
		<!-- #endif -->
		<view class="information_txt flex_Z">
			<text class="f48 c3 fw7">确认你的门店信息</text>
		</view>

		<view class="content flex_Z">
			<text class="f28 c3 fw7">门店名称</text>
			<text class="f28 c6 con_txt">{{joinDetails.name}}</text>
		</view>
		<view class="content flex_Z">
			<text class="f28 c3 fw7">门店类型</text>
			<text class="f28 c6 con_txt">{{joinDetails.company_type==1?'个体工商户':'企业'}}</text>
		</view>
		<view class="content flex_Z">
			<text class="f28 c3 fw7">支付机构</text>
			<text class="f28 c6 con_txt">{{joinDetails.pay_type == 2 ?' 拉卡拉支付':'汇付支付'}}</text>
		</view>
		<view class="content flex_Z">
			<text class="f28 c3 fw7">门店品类</text>
			<text class="f28 c6 con_txt">{{joinDetails.category_data}}</text>
		</view>
		<view class="content flex_Z">
			<text class="f28 c3 fw7">所在地区</text>
			<text class="f28 c6 con_txt">{{joinDetails.full_address}}</text>
		</view>
		<view class="content flex_Z">
			<text class="f28 c3 fw7">详细地址</text>
			<text class="f28 c6 con_txt">{{joinDetails.address}}</text>
		</view>
		<view class="content flex_Z">
			<text class="f28 c3 fw7">门店照片</text>
			<view class="storeimg">
				<image :src="joinDetails.cover" mode="aspectFill"></image>
				<image v-for="(item,index) in joinDetails.detail_images" :key="index" :src="item" mode="aspectFill"></image>
				<image :src="joinDetails.cashier_image" mode="aspectFill"></image>
			</view>
		</view>
		<view class="content flex_Z">
			<text class="f28 c3 fw7">地图位置</text>
			<view class="maps" >
				<map style="width: 100%; height: 200rpx;" :enable-zoom="false" :enable-scroll="false" :longitude="joinDetails.longitude" :latitude="joinDetails.latitude"></map>
			</view>
		</view>
		
		<view v-if="!typeState">
			<view class="content flex_Z">
				<text class="f28 c3 fw7">执照名称</text>
				<text class="f28 c6 con_txt">{{sellerAuth.license_name}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7">统一社会信用代码</text>
				<text class="f28 c6 con_txt">{{sellerAuth.social_credit_code}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" v-if="joinDetails.company_type == 1" >经营管理人姓名</text>
				<text class="f28 c3 fw7"  v-if="joinDetails.company_type == 2" >法定代表人姓名</text>
				<text class="f28 c6 con_txt">{{sellerAuth.legal_person_name}}</text>
			</view>
			<view class="content flex_Z" v-if="sellerAuth.business_term_end == '无'">
				<text class="f28 c3 fw7">营业期限</text>
				<text class="f28 c6 con_txt">长期 </text>
			</view>
			<view class="content flex_Z" v-else >
				<text class="f28 c3 fw7">营业期限</text>
				<text class="f28 c6 con_txt">{{sellerAuth.business_term_start}} 至  {{sellerAuth.business_term_end == '无'?'长期':sellerAuth.business_term_end}}  </text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7">企业注册地址 </text>
				<text class="f28 c6 con_txt">{{sellerAuth.company_address}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" v-if="joinDetails.company_type == 1" >经营管理人身份证姓名</text>
				<text class="f28 c3 fw7"  v-if="joinDetails.company_type == 2" >法定代表人身份证姓名</text>
				<text class="f28 c6 con_txt">{{sellerAuth.id_card_name}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" v-if="joinDetails.company_type == 1" >经营管理人身份证号</text>
				<text class="f28 c3 fw7"  v-if="joinDetails.company_type == 2" >法定代表人身份证号</text>
				<text class="f28 c6 con_txt">{{sellerAuth.id_number}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" v-if="joinDetails.company_type == 1" >经营管理人身份证有效期</text>
				<text class="f28 c3 fw7"  v-if="joinDetails.company_type == 2" >法定代表人身份证有效期</text>
				<text class="f28 c6 con_txt">{{sellerAuth.id_number_start}} - {{sellerAuth.id_number_end}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" >经营管理人手机号</text>
				<text class="f28 c6 con_txt">{{sellerAuth.legal_mobile_no}}</text>
			</view>
		</view>
		
		
		<view v-else >
			<view class="content flex_Z">
				<text class="f28 c3 fw7">执照名称</text>
				<text class="f28 c6 con_txt">{{ocrLicenseInfo.license_name}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7">统一社会信用代码</text>
				<text class="f28 c6 con_txt">{{ocrLicenseInfo.social_credit_code}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" v-if="joinDetails.company_type == 1" >经营管理人姓名</text>
				<text class="f28 c3 fw7"  v-if="joinDetails.company_type == 2" >法定代表人姓名</text>
				<text class="f28 c6 con_txt">{{ocrLicenseInfo.legal_person_name}}</text>
			</view>
			<view class="content flex_Z" v-if="ocrLicenseInfo.business_term_end == '无'">
				<text class="f28 c3 fw7">营业期限</text>
				<text class="f28 c6 con_txt">长期 </text>
			</view>
			<view class="content flex_Z" v-else >
				<text class="f28 c3 fw7">营业期限</text>
				<text class="f28 c6 con_txt">{{ocrLicenseInfo.business_term_start}} 至  {{ocrLicenseInfo.business_term_end == '无'?'长期':ocrLicenseInfo.business_term_end}}  </text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7">企业注册地址 </text>
				<text class="f28 c6 con_txt">{{ocrLicenseInfo.company_address}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" v-if="joinDetails.company_type == 1" >经营管理人身份证姓名</text>
				<text class="f28 c3 fw7"  v-if="joinDetails.company_type == 2" >法定代表人身份证姓名</text>
				<text class="f28 c6 con_txt">{{ocrIdentityInfo.id_card_name}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" v-if="joinDetails.company_type == 1" >经营管理人身份证号</text>
				<text class="f28 c3 fw7"  v-if="joinDetails.company_type == 2" >法定代表人身份证号</text>
				<text class="f28 c6 con_txt">{{ocrIdentityInfo.id_number}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" v-if="joinDetails.company_type == 1" >经营管理人身份证有效期</text>
				<text class="f28 c3 fw7"  v-if="joinDetails.company_type == 2" >法定代表人身份证有效期</text>
				<text class="f28 c6 con_txt">{{ocrIdentityInfo.id_number_start}} - {{ocrIdentityInfo.id_number_end}}</text>
			</view>
			<view class="content flex_Z">
				<text class="f28 c3 fw7" >经营管理人手机号</text>
				<text class="f28 c6 con_txt">{{ocrIdentityInfo.legal_mobile_no}}</text>
			</view>
		</view>
		
<!-- 		<view class="content flex_Z" v-if="sellerAuth.industry_qualification">
			<text class="f28 c3 fw7">行业资质</text>
			<view class="hyzz flex_ZC">
				<image v-for="(item,index) in sellerAuth.industry_qualification" :src="item" mode="aspectFill"></image>
			</view>
		</view> -->
		

		<view class="btns flex_ld" v-if="!applyState">
			<text class="sign_out" @click="leftClick">返回修改</text>
			<view class="service flex_dq">
				<text class="service1"  @click="$u.debounce(ruleVerification, 300)">确认提交</text>
			</view>
		</view>
		<view class="btns flex_ld" v-else >
			<text class="service2" @click="modifyData">修改申请资料</text>
		</view>
		<view class="empty3"></view>

	</view>
</template>

<script>
	import {settledDetails,settledTwoSave } from "../../api/join.js"
	export default {
		data() {
			return {
				statusBarHeight: 0, //状态栏高度
				titleHeight: 0, // 标题栏高度
				backgroundColor: '',
				baseUrl: this.$imageBaseUrl,
				
				typeState:false,
				applyState:false,
				joinDetails:{}, //入驻申请详情
				sellerAuth:{},
				ocrLicenseInfo: {}, //营业执照信息
				ocrIdentityInfo: {}, //身份证信息
				qualifications:[],//行业资质
			}
		},

		onReady() {
			// #ifdef MP-WEIXIN 
			uni.getSystemInfo({
				success: res => {
					this.statusBarHeight = res.statusBarHeight
					console.log(this.statusBarHeight);
				}
			})
			const custombar = uni.getMenuButtonBoundingClientRect();
			this.titleHeight = (custombar.top - this.statusBarHeight) * 2 + custombar.height
			console.log(this.titleHeight);
			// #endif

		},
		onLoad(e) {
			console.log(e);
			this.applyState = e.applyState
			this.typeState = e.typeState
			this.applicationDetails()
		},
		onShow() {
			console.log(uni.getStorageSync('ocrLicenseInfo'));
			console.log(uni.getStorageSync('ocrIdentityInfo'));
			
			if (uni.getStorageSync('ocrLicenseInfo')) {
				this.ocrLicenseInfo = uni.getStorageSync('ocrLicenseInfo')
			}
			
			if (uni.getStorageSync('ocrIdentityInfo')) {
				this.ocrIdentityInfo = uni.getStorageSync('ocrIdentityInfo')
			}
			
			if (uni.getStorageSync('qualifications')) {
				this.qualifications = uni.getStorageSync('qualifications')
			}
		},
		methods: {
			leftClick() {
				//获取页面栈的长度
				const canNavBack = getCurrentPages()
				console.log(canNavBack.length);
				// 判断是否刷新了浏览器，刷新了浏览器，页面栈只有当前一个
				if (canNavBack.length > 1) {
					uni.navigateBack({
						delta: 1
					})
				} else {
					uni.switchTab({
						url: '/pages/index/cloudCatIndex'
					})
				}
			},
			// 入驻申请详情
			applicationDetails(){
				settledDetails().then(res=>{
					console.log(res);
					if(res.code == 1){
						this.joinDetails = res.data
						if(res.data.seller_auth){
							this.sellerAuth = res.data.seller_auth
						}
					}
				})
			},
			// 规则校验
			ruleVerification() {
					if (this.ocrLicenseInfo.legal_person_name !=  this.ocrIdentityInfo.id_card_name) {
						uni.$u.toast('法人身份证姓名与营业执照上的姓名不一致');
						return false;
					}
				this.nextStep()
			},
			// 确认提交
			nextStep() {
				let data = {
					seller_id: this.joinDetails.id,
					business_license: this.ocrLicenseInfo.image,
					license_name: this.ocrLicenseInfo.license_name,
					social_credit_code: this.ocrLicenseInfo.social_credit_code,
					legal_person_name: this.ocrLicenseInfo.legal_person_name,
					business_term_start: this.ocrLicenseInfo.business_term_start,
					business_term_end: this.ocrLicenseInfo.business_term_end,
					company_address: this.ocrLicenseInfo.company_address,
					province_id: this.ocrLicenseInfo.province_id,
					city_id: this.ocrLicenseInfo.city_id,
					county_id: this.ocrLicenseInfo.county_id,
					id_card_front: this.ocrIdentityInfo.id_card_front,
					id_card_back: this.ocrIdentityInfo.id_card_back,
					industry_qualification:this.qualifications.join(),
					id_card_name: this.ocrIdentityInfo.id_card_name,
					id_number: this.ocrIdentityInfo.id_number,
					id_number_start: this.ocrIdentityInfo.id_number_start,
					id_number_end:  this.ocrIdentityInfo.id_number_end,
					id_address:  this.ocrIdentityInfo.id_address,
					legal_mobile_no:  this.ocrIdentityInfo.legal_mobile_no,
					mask:1
				};
				console.log(data);
				settledTwoSave(data).then(res => {
					console.log(res);
					if (res.code == 1) {
						uni.removeStorageSync('agree1');
						uni.navigateTo({
							url: '/pagesMy/businessJoin/success?payType=' + this.joinDetails.pay_type
						})
					}
				})
			},
			// 修改资料
			modifyData(){
				uni.navigateTo({
					url:'/pagesMy/businessJoin/joinApplyOne'
				})
			}
		},
		// 页面滚动
		onPageScroll: function(e) {
			const scrollTop = e.scrollTop; // 获取页面滚动位置
			// 根据滚动位置修改状态栏样式
			if (scrollTop > 20) {
				this.backgroundColor = '#ffffff';
			} else {
				this.backgroundColor = '';
			}
			// console.log("滚动距离为：" + e.scrollTop);
		},
	}
</script>

<style scoped>
	.module {
		width: 750rpx;
		margin: 0 auto;
	}

	.custom_box {
		width: 750rpx;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 998;
		padding-bottom: 10rpx;
		opacity: 1;
	}

	.indexbg {
		position: absolute;
		top: 0;
		left: 0;
		width: 750rpx;
		height: 460rpx;
	}

	.custom_nav {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 750rpx;
		font-size: 36rpx;
		z-index: 9;
		color: #FFFFFF;
	}

	.goback {
		position: absolute;
		left: 30rpx;
		text-align: center;
		width: 40rpx;
		height: 40rpx;
	}

	.information_txt {
		width: 686rpx;
		padding: 16rpx 0;
		margin-bottom: 40rpx;
	}

	.content {
		width: 686rpx;
		padding: 32rpx 0 20rpx;
		box-shadow: inset 0rpx -1rpx 0rpx 0rpx rgba(0, 0, 0, 0.05);
	}

	.con_txt {
		/* padding: 20rpx 0 14rpx 0; */
		padding-top: 20rpx;
	}
	.storeimg{
		margin-top: 24rpx;
		padding-bottom: 10rpx;
	}
	.storeimg>image{
		width: 202rpx;
		height: 202rpx;
		border-radius: 8rpx;
		margin-right: 24rpx;
	}
	.hyzz{
		margin-top: 24rpx;
		padding-bottom: 10rpx;
	}
	.hyzz>image{
		width: 650rpx;
		height: 360rpx;
		margin-bottom: 24rpx;
	}



	.btns {
		position: fixed;
		bottom: 0rpx;
		left: 50%;
		transform: translateX(-50%);
		width: 690rpx;
		height: 150rpx;
		background: #f8f8f8;
	}

	.sign_out {
		width: 158rpx;
		height: 88rpx;
		font-size: 32rpx;
		color: #333333;
		line-height: 88rpx;
		text-align: center;
		background: #FFFFFF;
		font-weight: 500;
		border-radius: 20rpx;
		border: 2rpx solid rgba(153, 153, 153, 0.18);
	}

	.service1 {
		width: 504rpx;
		height: 88rpx;
		line-height: 88rpx;
		font-size: 32rpx;
		color: #333333;
		font-weight: 500;
		text-align: center;
		background: #FFCC28;
		border-radius: 20rpx;
	}
	.service2 {
		width: 686rpx;
		height: 88rpx;
		line-height: 88rpx;
		font-size: 32rpx;
		color: #333333;
		font-weight: 500;
		text-align: center;
		background: #FFCC28;
		border-radius: 20rpx;
	}
</style>